<!DOCTYPE html>
<html>

{include file='public/header'}
<style>
    .layui-input-block{
        margin-left: 0px;
    }
    .layui-inline{
        margin-bottom: 5px;
    }
    .layui-form-label{
        padding: 9px 12px;
    }
</style>
<body>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="javascript:void(0)">首页</a>
            <a href="javascript:void(0)">记录管理</a>
            <a><cite>充值记录</cite></a>
        </span>
        <a class="layui-btn layui-btn-small" id="reload" title="刷新">
            <i class="layui-icon" style="line-height:30px"><i class="iconfont">&#xe6aa;</i></i>
        </a>
    </div>
    <div class="x-body">
        <div class="layui-row">
            <form class="layui-form" id = 'handle-form'>
                <div class="layui-inline">
                    <label class="layui-form-label w-auto">用户ID：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="uid" placeholder="请输入用户ID" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label w-auto">短剧：</label>
                    <div id="pVideo" class="layui-input-inline" style="width:200px;flex:1"></div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">支付状态：</label>
                    <div class="layui-input-inline" style="width:182px">
                        <select name="status" id="status">
                            <option value="">请选择</option>
                            <option value="1">已支付</option>
                            <option value="0">未支付</option>
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">充值类型：</label>
                    <div id="pRechargeType" style="flex:1;width:200px" class="layui-input-inline"></div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">链接ID：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="link_id" placeholder="请输入链接ID" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">订单号：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="order_no" placeholder="请输入订单号" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">微信/支付宝订单号：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="wechat_order_no" placeholder="请输入订单号" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">平台订单号（第三方/快手/抖音）：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="platform_order_no" placeholder="请输入订单号" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">产品来源：</label>
                    <div id="pSourceList" name="source" style="flex:1;width:182px" class="layui-input-inline"></div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">选择公司：</label>
                    <div id="pMenu2" style="flex:1;width:200px" class="layui-input-inline"></div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label w-auto">负责人：</label>
                    <div class="layui-input-inline" id="pMenu" style="flex:1;width:200px"></div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label w-auto">选择商户：</label>
                    <div id="payMerchantSelect" style="flex:1;width:200px" class="layui-input-inline"></div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label w-auto">充值时间：</label>
                    <div class="layui-inline" id="time" style="display: flex;align-items: center;">
                        <div class="layui-input-inline" style="margin-right:10px">
                            <input type="text" autocomplete="off" name="start_date" id="start_date" class="layui-input"
                                placeholder="开始日期">
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline">
                            <input type="text" autocomplete="off" name="end_date" id="end_date" class="layui-input"
                                placeholder="结束日期">
                        </div>
                    </div>
                </div>
                <br>
                <button class="layui-btn" lay-submit lay-filter="searchList">搜索</button>
                <button type="reset" id="resetList" class="layui-btn layui-btn-primary">重置</button>
                <button type="button" id="leading-out" class="layui-btn layui-btn-normal">导出</button>
            </form>
        </div>
        <table id="rechargeIndex" lay-filter="rechargeIndex"></table>
    </div>
    <script type="text/html" id="tbBar">
        {{#
            if(d.can_refund === 1){
                return  `
                    <a class="layui-btn layui-btn-xs" lay-event="refund">退款</a>
                `
            }
        }}
    </script>
    <script>
        let params = {
            elem: '#rechargeIndex'
            , url: '/admin/record/rechargeList' //数据接口
            , id: 'rechargeIndex'
            , page:true
            , limit:15
            , cols: [[ //表头
                { field: 'id', title: 'ID', width: 100, fixed:'left', align:'center'}
                , { field: 'uid', title: '用户ID', width: 100, fixed:'left', align:'center'}
                , { field: 'order_no', title: '订单号',width:180, align:'center' }
                , { field: 'official_account_name', title: '公众号名称',width:100, align:'center' }
                , { field: 'applet_name', title: '小程序名称',width:100, align:'center' }
                , { field: 'company_name', title: '公司名称',width:100, align:'center' }
                , { field: 'source_text', title: '产品来源',width:140, align:'center' }
                , { field: 'applet_created_at', title: '小程序注册时间',width:180 , templet: function (d) {
                        return dayjsFormat(d.applet_created_at)
                    }, align:'center'
                }
                // , { field: 'official_account_created_at', title: '公众号注册时间',width:180 , templet: function (d) {
                //         return dayjsFormat(d.official_account_created_at)
                //     }, align:'center'
                // }
                , { field: 'type_text', title: '充值类型',width:100, align:'center'
                }
                , { field: 'device_type_text', title: '设备类型',width:80, align:'center'}
                , { field: 'total_fee', title: '充值金额(元)', width:110, align:'center' }
                , { field: 'number', title: 'K币', width:110, align:'center' }
                // , { field: 'created_at', title: '提交时间', width:180 , templet: function (d) {
                //         return dayjsFormat(d.created_at)
                //     }, align:'center'
                // }
                , { field: 'link_id', title: '链接ID',width:80, align:'center'}
                , { field: 'activation_time', title: '激活时间', width:180, align:'center' }
                , { field: 'pay_time', title: '充值时间',width:180 , templet: function (d) {
                        return dayjsFormat(d.pay_time)
                    }, align:'center'
                }
                
                , { field: 'status', title: '状态',width:80, templet: function (d) {
                        return d.status == 1 ? '已支付' : '未支付'
                    }, align:'center'
                }
                , { field: 'refund_status_text', title: '退款状态',width:120, align:'center'}
                , { field: 'pay_merchant_name', title: '支付商户',width:120, align:'center'}
                
                , { field: 'video_id', title: '短剧ID',width:80, align:'center'}
                , { field: 'video_name', title: '短剧名称' , align:'center' }
                , { toolbar: '#tbBar', title: '操作', width: 100, align:'center'}
                
            ]]
        }
        tableList(params)
        layui.use(['table','layer'], function () {
            var table = layui.table;
            table.on('tool(rechargeIndex)', function (obj) {
                var event = obj.event;
                if (event === 'refund'){
                    x_admin_show('退款', `./refund.html?id=${obj.data.id}`, 700, 550);
                }
            });

        });
        
        layui.use(['laydate','table'], function () {
            var laydate = layui.laydate;
            var table = layui.table;
            //日期范围
            laydate.render({
                elem: '#time'
                , range: ['#start_date', '#end_date']
                ,format: 'yyyy-MM-dd'
            });
            $('#refund').click(function(){
                var checkStatus = table.checkStatus('rechargeIndex')
                if(checkStatus.data.length === 0){
                    layer.msg('请选择后再操作',{icon:5,time:1000});
                }else{
                    let id_string = []
                    checkStatus.data.forEach(item=>{
                        id_string.push(item.id)
                    })
                    AnyAjax('确定要退款吗？','/admin/record/batchRefund',{ ids:id_string.toString() },'rechargeIndex')
                }
            })

        })

        let selectParams = {
            url:'/admin/responsibilityPerson/select',
            selected:[],
            tips:'请选择',
            name: 'responsibility_person_id',
            field_id:'responsibility_person_id',
            field_Name:'responsibility_person_name',
            elem: '#pMenu'
        }
        selectN(selectParams)

        let selectRechargeType = {
            url:'/admin/money/getRechargeType?type=0',
            selected:[],
            tips:'选择充值类型',
            name: 'type',
            field_id:'id',
            field_Name:'name',
            elem: '#pRechargeType'
        }
        selectN(selectRechargeType)

        let selectSourceList = {
            url:'/admin/record/getSourceList',
            selected:[],
            tips:'选择产品来源',
            name: 'source',
            field_id:'id',
            field_Name:'name',
            elem: '#pSourceList'
        }
        selectN(selectSourceList)

        $("#leading-out").click(function() {
            var data = $('#handle-form').serialize();
            derive('/admin/record/leadingOut',data)
        });

        let selectParams2 = {
            url: '/admin/company/select',
            selected: [],
            tips: '选择公司',
            name: 'company_id',
            field_id: 'id',
            field_Name: 'name',
            elem: '#pMenu2'
        }
        selectN(selectParams2)

        let payMerchantSelect = {
            url: '/admin/record/payMerchantSelect',
            selected: [],
            tips: '选择商户',
            name: 'pay_merchant',
            field_id: 'pay_merchant',
            field_Name: 'pay_merchant_name',
            elem: '#payMerchantSelect'
        }
        selectN(payMerchantSelect)

        let selectVideo = {
            url: '/admin/video/select',
            selected: [],
            tips: '选择短剧',
            name: 'video_id',
            field_id: 'id',
            field_Name: 'name',
            elem: '#pVideo'
        }
        selectN(selectVideo)
    </script>
</body>

</html>